<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    textarea {
        width: 500px;
        height: 300px;
        resize: none;
    }
    li {
        width: 300px;
        background: #999999;
    }
    li > a {
        float: right;
    }
</style>
<body>
<textarea id=""></textarea>
<button>发布</button>
<ul>
</ul>
<script>
    var text = document.querySelector('textarea');
    var btn = document.querySelector('button');
    var ul = document.querySelector('ul');
    btn.onclick = function () {
        if (text.value == ''){
            alert('请输入字');
            return false;
        } else {
            var li = document.createElement('li');
            li.innerHTML = text.value+"<a href='javascript:;'>删除</a>";
            ul.insertBefore(li,ul.children[0]);
            /*ul.appendChild(li);*/
            text.value = '';
        }
        var as = document.querySelectorAll('a');
        for (var i = 0;i < as.length;i++) {
            as[i].onclick = function () {
                ul.removeChild(this.parentNode);
            }
        }
    }
</script>
</body>
</html>